<template>
    <div>
        <Modal v-model="isShowModal" :title="title" @on-cancel="hide('formValidate')" :mask-closable="false">

            <Form ref="formValidate" :model="params" :rules="ruleValidate" label-position="top">
                <FormItem label="物流公司：" prop="logisticsCompanyId">
                    <Select
                            placeholder="请选择物流公司"
                            v-model="params.logisticsCompanyId"
                            filterable
                            remote
                            :remote-method="queryLogistics"
                            :loading="loadingLogistics">
                        <Option v-for="(item, index) in logisticsCompany" :value="item.logisticsId" :key="index">{{item.logisticsName}}</Option>
                    </Select>
                </FormItem>
                <FormItem label="物流单号：" prop="logisticsNum">
                    <Input v-model.trim="params.logisticsNum" placeholder="请输入物流单号"></Input>
                </FormItem>
            </Form>

            <!-- 重写对话框底部按钮 -->
            <div slot="footer">
                <Button @click="hide('formValidate')">取消</Button>
                <Button type="primary" @click="handleSubmit('formValidate')" :loading="loadingBtn">
                    <span v-if="!loadingBtn">确定</span>
                    <span v-else>请稍候...</span>
                </Button>
            </div>
        </Modal>
    </div>
</template>

<script>
    export default {
        name: "order-logistics-tracking",
        data() {
            return {
                isShowModal: false,
                loadingBtn: false,
                loadingLogistics: false,
                title: '物流单号',
                type: 0,
                logisticsCompany:[],
                params: {
                    mallOrderId: '',
                    logisticsCompanyId: '',
                    logisticsNum: '',
                    orderMallLogisticsId:''
                },
                ruleValidate: {
                }
            }
        },
        methods: {
            // 点击提交验证
            handleSubmit(name) {
                // console.log(this.params);
                this.$refs[name].validate((valid) => {
                    if (valid) {
                        // this.$Message.error('验证通过');
                        /**
                         * type判断
                         * 1.发货 2.修改物流信息
                         */
                        switch (this.type) {
                            case 1:
                                // 修改物流信息
                                this.sendOrderMall();
                                break;
                            case 2:
                                // 修改物流信息
                                this.updateMallGoodsOrderLogistics();
                                break;
                            default:
                                this.$Notice.error({
                                    title: '物流信息管理',
                                    desc: '查看，新增，编辑区分判断报错',
                                    duration: 0
                                });
                                break
                        }
                    } else {
                        this.$Message.error('还有信息没有填写合格哦~');
                    }
                })
            },
            // 显示模态框
            show(row, type) {
                this.isShowModal = true;
                this.type = type;
                /**
                 * type判断
                 * 1.发货 2.修改物流信息
                 */
                switch (type) {
                    case 1:
                        this.title = '发货管理';
                        this.params.mallOrderId = row.mallOrderId;
                        break;
                    case 2:
                        this.title = '修改物流信息';
                        this.params.orderMallLogisticsId = row.orderMallLogisticsId;
                        break;
                    default:
                        this.$Notice.error({
                            title: '物流信息管理',
                            desc: '查看，新增，编辑模态框报错',
                            duration: 0
                        });
                        break
                }
            },
            // 根据输入的物流公司名称查询
            queryLogistics(query) {
                this.loadingLogistics = true;
                this.axios.post('/logistics/queryLogistics', {
                    logisticsCompanyName: query
                }).then(res => {
                    console.log(res);
                    setTimeout(() => {
                        this.loadingLogistics = false;
                    }, 300);
                    if (res.status == 200) {
                        // this.$Message.success('操作成功.');
                        this.logisticsCompany = res.data
                    }
                    if (res.status == 500) {
                        this.$Notice.error({
                            title: '服务器内部错误',
                            desc: '查看订单详情接口报错',
                            duration: 0
                        });
                    }
                })
            },
            // 发货
            sendOrderMall() {
                this.$Spin.show();
                this.axios.post('/orderMall/sendOrderMall', this.params).then(res => {
                    console.log(res);
                    setTimeout(()=>{
                        this.$Spin.hide();
                    },300);
                    if (res.status == 200) {
                        this.$emit('changeDate');
                        this.$Message.success('操作成功.');
                        this.hide('formValidate');
                    }
                    if(res.status == 201){
                        this.$Message.error(res.msg);
                    }
                    if (res.status == 500) {
                        this.$Notice.error({
                            title: '服务器内部错误',
                            desc: '发货接口报错',
                            duration: 0
                        });
                    }
                })
            },
            // 修改物流单号
            updateMallGoodsOrderLogistics() {
                this.$Spin.show();
                this.axios.post('/orderMall/updateMallGoodsOrderLogistics', this.params).then(res => {
                    console.log(res);
                    setTimeout(()=>{
                        this.$Spin.hide();
                    },300);
                    if (res.status == 200) {
                        this.$emit('changeDate');
                        this.$Message.success('操作成功.');
                        this.hide('formValidate');
                    }
                    if(res.status == 201){
                        this.$Message.error(res.msg);
                    }
                    if (res.status == 500) {
                        this.$Notice.error({
                            title: '服务器内部错误',
                            desc: '修改物流单号接口报错',
                            duration: 0
                        });
                    }
                })
            },
            // 关闭模态框
            hide(name) {
                this.isShowModal = false;
                this.params.mallOrderId = '';
                this.params.orderMallLogisticsId = '';
                this.$refs[name].resetFields();
            }
        }
    }
</script>

<style scoped lang="less">

</style>